<template>
	<view class="app-container">
		<u-icon name="rmb-circle-fill" size="50" color="#FF9F0A"></u-icon>
		<view class="label-txt">账户余额</view>
		<view class="balance">
			<text>￥</text>
			<text class="money">{{price}}</text>
		</view>
		<button class="btn" @click="withdrawal">提 现</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				price:""
			}
		},
		onShow(){
			this.getInfo()
		},
		methods: {
			withdrawal(){
				uni.redirectTo({
					url: "../withdrawal/withdrawal"
				})
			},
			getInfo(){
				this.$store.dispatch('user/getInfo').then(res => {
					console.log(1212,res);
					let { price } = res;
					this.price = price;
				});
			},
		}
	}
</script>

<style lang="scss">
	.app-container {
		padding: 20px;
		margin-top: 30px;
		display: flex;
		flex-direction: column;
		align-items: center;
		
		.label-txt {
			font-size: 15px;
			color: #8590a6;
			margin-top: 20px;
		}
		
		.balance {
			margin-top: 5px;
			display: flex;
			align-items: center;
			font-size: 24px;
			font-weight: bold;
			color: #000;
		
			.money {
				font-size: 36px;
				margin-left: 5px;
			}
		}
		
		.btn {
			width: 50%;
			color: #fff;
			background-image: linear-gradient(to right, #38dde5, #1891d6);
			position: absolute;
			bottom: 30%;
		}
	}
</style>
